.NET MAUI (Multi-platform App UI) অ্যাপ্লিকেশন তৈরিতে বিভিন্ন ধরনের navigation কন্ট্রোল প্রদান করে। এর মধ্যে Flyout Navigation এবং Tabbed Navigation হল দুইটি জনপ্রিয় ধরনের নেভিগেশন প্যাটার্ন, যা ডেভেলপারদের অ্যাপ্লিকেশনের বিভিন্ন স্ক্রীন বা পেজের মধ্যে সহজে নেভিগেট করার সুযোগ দেয়।
নিচে Flyout এবং Tabbed Navigation তৈরি করার পদ্ধতি বিস্তারিতভাবে আলোচনা করা হয়েছে।
Flyout Navigation তৈরি করা
Flyout Navigation একটি সাইড মেনু বা স্লাইডআউট মেনু হিসেবে কাজ করে, যা সাধারণত অ্যাপ্লিকেশনের প্রধান স্ক্রীনের একপাশে থাকে এবং ব্যবহারকারী একাধিক পেজের মধ্যে নেভিগেট করতে পারে।
Flyout Navigation এর উদাহরণ:
- MainPage.xaml:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="MauiApp1.MainPage">
<Shell xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="MauiApp1.AppShell">
<!-- Flyout Menu Items -->
<FlyoutItem Title="Home">
<ShellContent ContentTemplate="{DataTemplate local:HomePage}" />
</FlyoutItem>
<FlyoutItem Title="Settings">
<ShellContent ContentTemplate="{DataTemplate local:SettingsPage}" />
</FlyoutItem>
<FlyoutItem Title="Profile">
<ShellContent ContentTemplate="{DataTemplate local:ProfilePage}" />
</FlyoutItem>
</Shell>
</ContentPage>
- AppShell.xaml.cs:
public partial class AppShell : Shell
{
public AppShell()
{
InitializeComponent();
}
}
এখানে:
- FlyoutItem হলো স্লাইডআউট মেনুর একটি আইটেম।
- ShellContent এর মাধ্যমে নির্দিষ্ট স্ক্রীন বা পেজের জন্য কন্টেন্ট দেওয়া হয়।
ContentTemplate="{DataTemplate local:HomePage}"এখানেHomePage,SettingsPage, এবংProfilePageডেফাইন করা স্ক্রীন বা পেজগুলো।
Flyout Navigation এর বৈশিষ্ট্য:
- FlyoutItem: মেনু আইটেম যা ব্যবহারকারীর কাছে দৃশ্যমান হবে।
- ShellContent: প্রতিটি মেনু আইটেমের সাথে যুক্ত স্ক্রীন বা কন্টেন্ট প্রদর্শন করা হয়।
- FlyoutHeader এবং FlyoutFooter: কাস্টম হেডার বা ফুটার যোগ করার জন্য ব্যবহার করা হয়।
Tabbed Navigation তৈরি করা
Tabbed Navigation হল একটি নেভিগেশন প্যাটার্ন যা স্ক্রীনের উপরের বা নীচে ট্যাব ব্যবহার করে অ্যাপ্লিকেশনের বিভিন্ন অংশের মধ্যে পরিবর্তন করতে সাহায্য করে। এটি খুবই জনপ্রিয় বিশেষত মোবাইল অ্যাপ্লিকেশনের জন্য।
Tabbed Navigation এর উদাহরণ:
- MainPage.xaml:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="MauiApp1.MainPage">
<Shell xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="MauiApp1.AppShell">
<!-- Tabbed Navigation -->
<TabBar>
<Tab Title="Home">
<ShellContent ContentTemplate="{DataTemplate local:HomePage}" />
</Tab>
<Tab Title="Settings">
<ShellContent ContentTemplate="{DataTemplate local:SettingsPage}" />
</Tab>
<Tab Title="Profile">
<ShellContent ContentTemplate="{DataTemplate local:ProfilePage}" />
</Tab>
</TabBar>
</Shell>
</ContentPage>
- AppShell.xaml.cs:
public partial class AppShell : Shell
{
public AppShell()
{
InitializeComponent();
}
}
এখানে:
- TabBar হল ট্যাবগুলি ধারণ করার জন্য একটি কন্টেইনার, যার মধ্যে একাধিক Tab থাকে।
- প্রতিটি Tab একটি স্ক্রীন বা পেজের সাথে যুক্ত থাকে যা ShellContent এর মাধ্যমে ডিফাইন করা হয়।
- Title অ্যাট্রিবিউট দিয়ে প্রতিটি ট্যাবের নাম নির্ধারণ করা হয়।
Tabbed Navigation এর বৈশিষ্ট্য:
- TabBar: সমস্ত ট্যাব একসাথে রাখার জন্য ব্যবহৃত হয়।
- Tab: প্রতিটি ট্যাবের জন্য উপাদান যেমন স্ক্রীন বা পেজ ডিফাইন করা হয়।
- ShellContent: প্রতিটি ট্যাবের কন্টেন্ট ডিফাইন করা হয়।
Flyout এবং Tabbed Navigation এর মধ্যে পার্থক্য:
- Flyout Navigation: সাইড মেনু ভিত্তিক নেভিগেশন পদ্ধতি। এটি বেশিরভাগ সময় বড় অ্যাপ্লিকেশন বা এমন অ্যাপ্লিকেশনের জন্য ব্যবহার করা হয় যেখানে অনেক পেজ বা অপশন থাকতে পারে।
- Tabbed Navigation: উপরের বা নীচে ট্যাবের মাধ্যমে পেজ স্যুইচিং করতে ব্যবহৃত হয়। এটি সাধারণত ছোট অ্যাপ্লিকেশনের জন্য বা যেখানে কিছু নির্দিষ্ট স্ক্রীন থাকে, সেখানে উপকারী।
সারাংশ:
- Flyout Navigation এবং Tabbed Navigation উভয়ই .NET MAUI তে খুবই সহজে ইমপ্লিমেন্ট করা যায় এবং তারা আপনাকে আপনার অ্যাপ্লিকেশনে উন্নত নেভিগেশন প্যাটার্ন যোগ করার সুযোগ দেয়।
- Flyout Navigation সাইডবার মেনু ব্যবহারের মাধ্যমে অ্যাপ্লিকেশনের বিভিন্ন অংশে নেভিগেট করতে সহায়তা করে, আর Tabbed Navigation ট্যাবের মাধ্যমে স্ক্রীনের বিভিন্ন অংশে পরিবর্তন করার সুবিধা দেয়।
Content added By
Read more
